define(['SelectInput'],function () {

    //3.28
    var SelectGroup = function () {


        var jsonData = null;

        //set selectCity value and load next select list
        //use mousedown to make it happen before blur event triggered
        $('body').on('mousedown', '[data-type="select-group"] [data-type="select-list"] li', function () {

            var that = this,
                $selectInput = $(this).parent().prev('[data-type="select-input"]'),
                $selectList = $(this).parent(),
                $selectDiv = $(this).parent().parent(),
                $selectGroup = $selectInput.parent().parent('[data-type="select-group"]'),
                $firstSelectInput = $selectGroup.find('[data-type="select-input"]').eq(0);

            $selectInput.val($(this).text()).attr('data-value', $(this).text());
            $selectList.hide();


            var str = '', flag = false;

            //get current level list from previous input and
            //save next level list to current input as custom attribute
            if ($selectDiv.index() == 0) {
                $.each(jsonData, function (i, v) {
                    if ($(that).html() == v.name && v.children) {
                        flag = true;
                        $selectInput[0].nextList = v.children;
                        $.each(v.children, function (i, v) {
                            str += '<li value="' + v.id + '">' + v.name + '</li>';
                        });
                    }
                });

            } else {
                var prevInput = $selectGroup.find('[data-type="select-input"]').get($selectDiv.index() - 1);
                $.each(prevInput.nextList, function (i, v) {
                    if($(that).html() == v.name && v.children){
                        flag = true;
                        $selectInput[0].nextList = v.children;
                        $.each(v.children, function (i, v) {
                            str += '<li value="' + v.id + '">' + v.name + '</li>';
                        });
                    }
                })
            }

            $selectDiv.next().nextAll().remove();

            if (flag) {
                var $cloneDiv = $selectDiv.clone();
                $cloneDiv.children('input').val('请选择').attr('data-value', '0');
                $cloneDiv.children('ul').html(str);

                if ($selectDiv.next('[data-type="select"]').length) {
                    $selectDiv.next().replaceWith($cloneDiv);
                } else {
                    $selectDiv.after($cloneDiv);
                }
            }

            //set data-value
            var areaStr = '';
            $.each($selectDiv.parent().children('[data-type="select"]'), function (i, v) {
                var cur = $(v).children('input').val();
                if (cur != '请选择') {
                    i == 0 ? areaStr = cur : areaStr += ',' + cur;
                }
            });
            $firstSelectInput.attr('data-value', areaStr);

        });

        function getValue(item) {
            if (!item) return '';
            return item.id || item.name;
        }


        function loadAllOption(selectGroup) {

            var optionArr = [],
                tempStr = '',
                url = $(selectGroup).attr('data-optiondata'),
                $selectInputGroup = $(selectGroup).find('[data-type="select-input"]'),
                dataValue = $selectInputGroup.eq(0).attr('data-value') || '',
                dataValueArr = dataValue.split(/[,，]/);
            optionArr.extra = [];


            $.getJSON(serverPathName + url, function (data) {
                jsonData = data;

                var nextJson = [], curJson = jsonData;
                $.each(dataValueArr, function (i, v) {

                    tempStr = '';
                    $.each(curJson, function (j, v) {
                        if (dataValueArr[i] == getValue(v)) {
                            nextJson = v.children;
                            optionArr.extra.push(nextJson);
                        }
                        tempStr += '<li value="' + v.id + '">' + v.name + '</li>';
                    });
                    curJson = nextJson;

                    optionArr.push(tempStr);

                });

                for (var i = 0; i < dataValueArr.length; i++) {
                    $selectInputGroup[i].nextList = optionArr.extra[i];
                    $($selectInputGroup[i]).next('ul').html(optionArr[i]);
                }

            });


        }

        $('[data-type="select-group"][data-optiondata]').each(function (i, v) {

            loadAllOption(v);
        });


    };
    SelectGroup();
	return SelectGroup;
});